<template>
  <div class="dabao">
    <div class="content_title">
      <span class="content_text">打包</span>
      <img class="content_img" src="@/assets/img/chart/cusha.png" alt="" srcset="" />
    </div>
    <div class="dabao_body">
      <div v-for="(item, index) in dabaoData" :key="index + 'a'" class="dabao_item">
        <div @click="clickHandle(item)">
          <dabao :data="item"></dabao>
        </div>
      </div>
    </div>
    <!-- 打包弹窗控件 -->
    <dabaoDialog :defaultData="data1" v-if="showModal" ref="dabaoDialog"></dabaoDialog>
    <!-- 动力柜弹窗控件 -->
    <!-- <dongliDialog ref="dongliDialog"></dongliDialog> -->
  </div>
</template>

<script>
// import dongliDialog from '@/views/monitorCenter/workChart/components/qcs/dialog/dialog_dongli/index'
import dabaoDialog from '@/views/monitorCenter/workChart/components/qcs/dialog/dialog_dabao/index'
import dabao from '@/views/monitorCenter/workChart/components/qcs/dabao'
import dongLiMenu from '@/assets/data/dongli.json'
import dongliItem from '@/assets/data/dongliItem.json'
export default {
  name: 'DaBao',
  props: {
    msg: String,
    // 是否嵌套在弹窗内
    inline: {
      type: Boolean,
      default: false
    }
  },
  components: {
    // dongliDialog,
    dabao,
    dabaoDialog
  },
  data() {
    return {
      dabaoData: [],
      showModal: false,
      data1: {}
    }
  },
  created() {
    this.dongLiMenu = dongLiMenu
    this.dongLiItem = dongliItem
  },
  computed: {
    daBaoGroupState() {
      let result
      if (this.$store.state.socketData.length != 0) {
        result = this.$store.state.socketData.filter(item => item.workshop == this.$store.state.workshopNo)
        result = result[0].dsDeviceRealTimeStatusListPack
      }
      return result
    }
  },
  watch: {
    daBaoGroupState: {
      immediate: true,
      handler(val) {
        if (val) {
          this.dabaoData = val
        }
      }
    }
  },
  methods: {
    closeHandle(type) {
      this.showModal = false
      this.showDongliModal = false
    },
    clickHandle(item) {
      this.data1 = item
      this.data1.classes = this.$store.state.workshopData.shiftPreSpinTxt
      this.showModal = true
    }
  }
}
</script>

<style lang="less" scoped>
@import '~@/assets/less/workshop.less';
.dabao_item {
  margin-bottom: 20px;
}
</style>
